<!DOCTYPE html>
<html lang="en">
<html xmlns:th="http://www.thymeleaf.org">
<head  th:replace="layouts::header">

</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <!--            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">-->
            <!--                <span class="sr-only">Toggle navigation</span>-->
            <!--                <span class="icon-bar"></span>-->
            <!--                <span class="icon-bar"></span>-->
            <!--                <span class="icon-bar"></span>-->

            <!--            </button>-->
            <a class="navbar-brand" href="/">MOVIES</a>
            <a class="navbar-brand" href="/actors">演员</a>
            <a class="navbar-brand" href="/">评论</a>
            <a class="navbar-brand" href="/directors/new">新增导演</a>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
            <form class="navbar-form navbar-right">
                <div class="form-group">
                    <input type="search" placeholder="Search" class="form-control">
                </div>
                <button type="submit" class="btn btn-success">Search</button>
            </form>
        </div>
    </div>
</nav>

<div id="myCarousel" class="carousel slide">

    <!-- 轮播（Carousel）指标 -->
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
        <li data-target="#myCarousel" data-slide-to="3"></li>

    </ol>

    <!-- 轮播（Carousel）项目 -->
    <div class="carousel-inner">
        <div class="item active">
            <img src="/thumbs/dao1.jpg" alt="First slide">
        </div>
        <div class="item">
            <img src="/thumbs/dao2.jpg" alt="Second slide">
        </div>
        <div class="item">
            <img src="/thumbs/an.jpg" alt="Third slide">
        </div>
        <div class="item">
            <img src="/thumbs/ha.jpg" alt="Third slide">
        </div>

    </div>

    <!-- 轮播（Carousel）导航 -->
    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>



</div>

<table class="table table-hover" >
    <thead>
    <tr>
        <th>导演名称</th>
        <th>出生</th>
        <th>经历</th>
    </tr>
    </thead>
    <tbody th:each=" aDirector: ${directors}">
    <tr>
        <td th:text="${aDirector.directorname}"></td>
        <td th:text="${aDirector.opus}"></td>
        <td th:text="${aDirector.born}"></td>
    </tr>
    </tbody>
</table>
</body>
</html>